<script lang="ts" setup>
//import { useAdminStore } from "@/stores/admin";
//import { useEmployeeStore } from "@/stores/employee";
//import { useUserStore } from "@/stores/user.js";

// 主界面容器
// 此文件中有全局的表格样式

//const user = useUserStore();
//const employee = useEmployeeStore();
//const admin = useAdminStore();

</script>

<template>
  <div class="out">
    <div class="in">
      <div>
        <!--
        <button @click="user.login('1', 'U-TEST')">用户登录</button>
        <button @click="user.logout()">用户退出</button>
        <button @click="employee.login('1', 'E-TEST')">员工登录</button>
        <button @click="employee.logout()">员工退出</button>
        <button @click="admin.login('A-TEST', '1')">管理员登录</button>
        <button @click="admin.logout()">管理员退出</button>-->
      </div>
      <el-scrollbar>
        <router-view/> <!-- 此处是主体界面 -->
      </el-scrollbar>
    </div>
  </div>
</template>

<style scoped>
.out {
  padding: 20px;
  background-color: #f0f0f0;
  height: 100vh;
}
.in {
  height: 100vh;
  background-color: white;
  border-radius: 5px;
}
</style>

<style>
.el-table {
  --el-table-text-color: #000000;
  --el-table-border: 0;
  text-align: center;
}
.el-table .el-table__cell {
  text-align: center;
}
.el-table th.el-table__cell {
  background-color: #f0f0f0;
}
.el-table:not(.el-table--border) .el-table__cell {
  border-right: 1px solid #ffffff;
}
.el-table__header-wrapper tr th.el-table-fixed-column--left, .el-table__header-wrapper tr th.el-table-fixed-column--right {
  background-color: #f0f0f0;
}
.el-table.is-scrolling-right th.el-table-fixed-column--right {
  background-color: #f0f0f0;
}
.el-table.is-scrolling-left .el-table-fixed-column--right.is-first-column:before {
  box-shadow: none;
}
.el-table.is-scrolling-middle .el-table-fixed-column--right.is-first-column:before {
  box-shadow: none;
}
</style>